//经办审批
<template>
  <div>
    <el-container>
      <el-aside width="20%">
        <el-menu :default-active="$route.path">
          <!-- class="el-menu-vertical-demo" -->
          <li
            v-for="(v, i) in routerList"
            :key="i"
            :class="[$route.path === v.path ? 'col' : '']"
          >
            <router-link :to="v.path">
              <el-menu-item>
                <i :class="v.icon"></i>
                <span>{{ v.title }}</span>
                <span
                  v-if="
                    i === 1 &&
                    NumData.applicationForPaymentOfMaterialPurchaseNum !== 0
                  "
                >
                  ({{
                    NumData.applicationForPaymentOfMaterialPurchaseNum
                  }})</span
                >
                <span
                  v-if="
                    i === 5 &&
                    NumData.contactSheetIssueApplicationForApprovalNum !== 0
                  "
                >
                  ({{
                    NumData.contactSheetIssueApplicationForApprovalNum
                  }})</span
                >
                <span
                  v-if="i === 0 && NumData.groupPaymentApplicationNum !== 0"
                >
                  ({{ NumData.groupPaymentApplicationNum }})</span
                >
                <span v-if="i === 3 && NumData.inChapterApplyNum !== 0">
                  ({{ NumData.inChapterApplyNum }})</span
                >
                <span
                  v-if="
                    i === 6 &&
                    NumData.materialPurchaseApplicationApprovalNum !== 0
                  "
                >
                  ({{ NumData.materialPurchaseApplicationApprovalNum }})</span
                >
                <span
                  v-if="
                    i === 4 &&
                    NumData.sampleSelectionApplicationForApprovalNum !== 0
                  "
                >
                  ({{ NumData.sampleSelectionApplicationForApprovalNum }})</span
                >
              </el-menu-item>
            </router-link>
          </li>
        </el-menu>
      </el-aside>
      <!-- 主体 -->
      <el-main>
        <router-view> </router-view>
      </el-main>
    </el-container>
  </div>
</template>

<script>
import routerList from "../../../utils/batchRouter";
export default {
  name: "HandleBatch",
  components: {},
  data() {
    return {
      routerList: routerList.HandleBatchRoute(),
      NumData: {
        groupPaymentApplicationNum: Number,
        applicationForPaymentOfMaterialPurchaseNum: Number,
        contactSheetIssueApplicationForApprovalNum: Number,
        inChapterApplyNum: Number,
        materialPurchaseApplicationApprovalNum: Number,
        sampleSelectionApplicationForApprovalNum: Number,
      },
      quantity: Number,
    };
  },
  computed: {},
  methods: {
    getNum() {
      let obj = JSON.parse(sessionStorage.getItem("employee"));
      this.$axios
        .get("/ApprovalComeOrFlowTogether/selectAll", {
          params: {
            account: Number(obj.account),
          },
        })
        .then((data) => {
          this.NumData = data.data.data;
          console.log(data.data.data);
        });
    },
  },
  created() {
    this.getNum();
  },
};
</script>
<style scoped lang='less'>
.el-aside {
  ul {
    background-color: #409eff !important;
    li {
      color: white;
    }
  }
  a {
    text-decoration: none;
  }
  li:hover {
    background-color: #2c72e7;
  }
}
//点击后样式
.el-menu-item:focus {
  background-color: #2c72e7;
}
.col {
  background-color: #2c72e7;
}
.el-main {
  padding: 20px;
  box-sizing: border-box;
}
</style>